<script src="__PUBLIC_JS__/jquery.2.1.4.min.js?v={:config('hisiphp.version')}"></script>
<script src="__PUBLIC_JS__/xm-select/dist/xm-select.js?v={:config('hisiphp.version')}"></script>
<script src="__PUBLIC_JS__/vue@3.2.26/dist/vue.global.js"></script>
<style>
    /*订单显示*/
    .item{ width:270px; height:135px; border:1px solid #ccc; padding:5px;border-radius:5px;float:left;margin:5px;}
    .item .tags{width:20px;float:left;text-align:center;}
    .item .pic{width:100px; float:left;text-align:center;}
    .item .pic img{max-width:100px; max-height:135px;border-radius:5px;}
    .item .text{width: 150px;text-align:left;float: right;}
    .active{border: 1px solid #658ced;background-color: #f2f2f2;}
    .text-item{width: 100%;}
    .clear{clear:both;}
    .layui-btn-small {
        height: 20px;
        line-height: 20px;
        padding: 0 5px;
        font-size: 12px;
    }
    .small-table{margin: 0; }
    .small-table td{padding: 4px;font-size: 10px}
</style>
<div class="fixed-bar">
    <form class="layui-form layui-form-pane fixed-bar-form" action="{:url()}" method="get" id="hisi-table-search-optable" >
        <div class="layui-form-item">
            <div class="layui-inline ">
                <label class="layui-form-label">订单号</label>
                <div class="layui-input-inline">
                    <input type="text" name="client_ordernum" value="{$client_ordernum}" lay-verify="" placeholder="输入订单号" class="layui-input">
                </div>
            </div>
            <div class="layui-inline removeStat">
                <label class="layui-form-label">SKU</label>
                <div class="layui-input-inline">
                    <input type="text" name="sku" value="{$sku}" lay-verify="" placeholder="输入SKU" class="layui-input">
                </div>
            </div>
            <div class="layui-inline removeStat">
                <label class="layui-form-label">出货日期</label>
                <div class="layui-input-inline">
                    <input type="text" name="shipment_date_range" readonly="" id="shipment_date_range" lay-verify="" placeholder="选择出货日期" class="layui-input">
                </div>
            </div>
            <div class="layui-inline removeStat">
                <label class="layui-form-label">完成时间</label>
                <div class="layui-input-inline">
                    <input type="text" name="tail_over_time_range" readonly="" id="tail_over_time_range" lay-verify="" placeholder="选择出货日期" class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">委外工厂</label>
                <div class="layui-input-inline" id="factory_all" style="width: auto;min-width: 250px;">
                </div>
            </div>
            <div class=" layui-inline layui-upload">
                <button type="submit" class="layui-btn"  lay-submit="" lay-filter="demo1"  >搜索</button>
            </div>
        </div>
    </form>
</div>

{include file="mp@out_node_progress/menu" /}

<div class="layui-collapse">
    <div class="layui-colla-item caigou">
        <h2 class="layui-colla-title" id="vue_tab_content">&nbsp;&nbsp;&nbsp;{{ status_sum }}</h2>
        <div id="view" class="layui-colla-content layui-show">
        </div>
    </div>
</div>

<script id="tpl" type="text/html">

    {{#  layui.each(d, function(kkk, vvv){ }}

    <div class="item layui-anim layui-anim-scaleSpring actionSendDeliver" data-option="{{ vvv.client_ordernum }}" >
        <a>
            <div class="pic">
                <img src="{{ vvv.pic_res }}" id="show_after_refund_{{vvv.id}}" onmouseover="show_after_refund({{vvv.id}},{{vvv.time_send_1}},'{{vvv.after_refund_type_txt}}','{{vvv.after_refund_num}}','{{vvv.after_refund_reason}}')"
                     class="lay-pic">
            </div>
        </a>
        <div class="text">
            <a>
                <div class="text-item"> 出货时间：{{ vvv.shipment_time }}&nbsp;</div>
                <span class="black" id="status_txt{{vvv.client_ordernum}}"  onmouseover="showDiv('status_txt{{vvv.client_ordernum}}', '电话提示：{{ vvv.mobile }}')" >{{ vvv.status_txt }}&nbsp;</span></br>

                <span class="copy-item blue">{{ vvv.client_ordernum }}</span>&nbsp;&nbsp; <span class="layui-btn layui-btn-small layui-btn-warm">{{ vvv.type_txt }}</span><br>
                <span class="copy-item blue">{{ vvv.sku }}</span></br>
                <span class="blue" id="getOrderDetail-{{vvv.id}}" onmouseover="getOrderDetail({{vvv.id}})" >{{ vvv.quantity }}</span>&nbsp;件
                &nbsp;<br>
            </a>
            <div class="text-item">
                <a title="{{ vvv.ft_name }}/{{ vvv.g_name }}"> <span style="float:left" >{{ vvv.g_name }}</span> </a>

                <a href="{:url('returnTime')}?order_id={{ vvv.id }}&type=readonly" style="float:right" title="订单操作" class="hisi-iframe" hisi-data="{width: '800px', height: '500px'}"><i class="aicon ai-caidan" style="font-size:25px;"></i>&nbsp;&nbsp;<a>
            </div>
            <a> </a>
        </div>
        <a> </a>
    </div>

    {{#  }); }}

    <div class="clear"></div>
</script>

<script id="onclickSewingTpl" type="text/html">
    <div class="layui-form-item pt20 pl20 layui-form">
        <form class="layui-form"  action="{:url('mp/OutNodeProgress/confirmReturnGoods')}"   id="form33" >
            {{#  layui.each(d.data, function(kkk, vvv){ }}
            <h2 class="layui-colla-title">订单{{ vvv.client_ordernum}}，裁剪：{{ vvv.sum_shicai_count}}件</h2>
            <div class="layui-form-item">
                <label class="layui-form-label" style="width:60px;">回货总数</label>
                <div class="layui-input-inline" style="width: 80px;">
                    <input type="text" class=" layui-input" name="sew_return_goods_num[]" style="width:80px;"  value="" autocomplete="off" placeholder="请输入数量" lay-verify="number">
                </div>
                <label class="layui-form-label" style="width:60px;">欠数</label>
                <div class="layui-input-inline" style="width: 80px;">
                    <input type="text" class=" layui-input" style="width:80px;"  name="sew_owe[]" value="" autocomplete="off" placeholder="裁数-回数" lay-verify="number">
                </div>
                <label class="layui-form-label" style="width:60px;">是否退料</label>
                <div class="layui-input-inline" style="width: 80px;">
                    <select name="sew_return_material_flag[]"  class="mimo-select group-id" style="width:80px;" lay-ignore="">
                        <option value="0" selected="">否</option>
                        <option value="1">是</option>
                    </select>
                </div>
            </div>
            {{# }); }}
            <div class="layui-inline fr" style="margin: 20px 20px;">
                <input type="hidden"  name="client_ordernum_all" value="{{ d.client_ordernum_all }}">
                <button type="button" class="layui-btn layui-btn-normal" id="submitSewingform">确定</button>
                <a href="javascript:parent.layui.layer.closeAll();" class="layui-btn layui-btn-primary ml10">取消</a>
            </div>
        </form>
    </div>
</script>

{include file="system@block/layui" /}
<script type="text/javascript">
    var res_data={};//所有数据集
    var select_data={};//所选择的数据集
    var txt_data={};
    var send_stock={};
    var laytpl = layui.laytpl;
    var layer = layui.layer;
    var factoryAll= JSON.parse('{:json_encode($factoryAll)}');
    //#vue_tab_content
    const allContent = {
        data() {
            return {
                status_sum:''
            }
        }
    }
    const vm=Vue.createApp(allContent).mount('#vue_tab_content');
    layui.use([ 'element', 'layer', 'laytpl', 'tool','laydate','table','form','flow'], function() {
        var element = layui.element;
        var layer = layui.layer;
        var $ = layui.jquery;
        var form = layui.form;
        var laytpl = layui.laytpl,laydate=layui.laydate ,table = layui.table;
        var flow = layui.flow;
        window.showDiv = function(id, msg) {
            tip_index_show=layer.tips("<span>"+msg+"</span>",
                "#"+id+"",
                {tips:[1, '#4794ec']});
            $("#"+id+"").mouseleave(function(){
                layer.close(tip_index_show);
            });
        }

        laydate.render({
            elem: '#date_edit'
            ,range: '~'
            ,theme: 'molv'
            ,mark: {'{:$today}':''}
            ,change: function(value, date, endDate){
                $('#date_edit').val(value);
                $('#layui-laydate1').remove();//关闭面板
            }
        });

        laydate.render({
            elem: '#shipment_date_range'
            ,range: '~'
            ,theme: 'molv'
            ,mark: {'{:$today}':''}
            ,change: function(value, date, endDate){
                $('#shipment_date_range').val(value);
                $('#layui-laydate1').remove();//关闭面板
            }
        });
        laydate.render({
            elem: '#tail_over_time_range'
            ,range: '~'
            ,theme: 'molv'
            ,mark: {'{:$today}':''}
            ,change: function(value, date, endDate){
                $('#tail_over_time_range').val(value);
                $('#layui-laydate1').remove();//关闭面板
            }
        });

        form.on('submit(demo1)', function (data) {
            layui.jquery('#view').html('');
            layui.jquery('#view').unbind();//重置page数
            flowload( data.field);
            return false;
        });

        function flowload(formData=[]){
            flow.load({
                elem: '#view' //流加载容器
                //滚动条所在元素，一般不用填，此处只是演示需要。
                ,done: function(page, next){ //执行下一页的回调
                    console.log(page)
                    var lis = [];
                    var url = "{:url('mp/OutNodeProgress/allFinish')}"+"?page="+page
                    $.ajax({
                        type: "POST",
                        url: url,
                        data: formData,
                        dataType:"json",
                        success: function(res){
                            if($.isEmptyObject(res.data) == false){
                                txt_data=res.txt;
                                res_data=$.extend(res_data, res.data);
                                var Tpl = $('#tpl').html();
                                laytpl(Tpl).render(res.data, function(html){
                                    lis.push(html);
                                    next(lis.join(''), page <= res.pageInfo.maxPage);
                                });
                            } else {
                                $('#view').find('div.layui-flow-more').html('<a href="javascript:;">没数据了</a>');
                                lis.push('暂无数据');
                            }
                            //状态统计信息显示
                            status_sum(res,page);
                            if(res.code==10001){
                                location.href=res.url;
                            }
                            //去除多余的div clear
                            if(layui.jquery('#view').find('div.clear').length>=2){
                                layui.jquery('#view').find('div.clear')[0].remove();
                            }
                            element.init();
                        }
                    });
                }
            });

        }
        flowload($('#hisi-table-search-optable').serialize());

        // 选择订单
        $(document).on('click','.actionSendDeliver',function(){
            if($(this).hasClass('active')){
                $(this).removeClass('active');
                for ( var key in send_stock ){
                    if( send_stock[$(this).attr('data-option')]==1){
                        delete send_stock[$(this).attr('data-option')];
                        break;
                    }
                }
            }else{
                $(this).addClass('active');
                send_stock[$(this).attr('data-option')] = 1;
            }
            get_select_data();
        });
        //尺码细数
        window.showQuantityDetail = function(order_id,type='order_count') {
            $.ajax({
                type: "POST",
                url: "{:url('mp/OutNodeProgress/getQuantityDetail')}?order_id="+order_id+"&type="+type,
                dataType:"json",
                success: function(res){
                    var top="",foot="",data=res.data;
                    if($.isEmptyObject(data) == false){
                        for (var k in data){
                            top+="<td>"+data[k]['size_name']+"</td>";
                            foot+="<td>"+data[k][type]+"</td>";
                        }
                    } else {
                        top+="<td>空</td>";
                        foot+="<td>空</td>";
                    }
                    var table="<table class='layui-table small-table'>";
                    table+="<tbody>";
                    table+="<tr class='top'>";
                    table+="<td>尺码</td>";
                    table+=top;
                    table+="</tr>";
                    table+="<tr class='foot'>";
                    switch (type) {
                        case 'order_count':
                            table+="<td>下单件数</td>";
                            break;
                        case 'shicai_count':
                            table+="<td>裁剪件数</td>";
                            break;
                    }
                    table+=foot;
                    table+="</tr>";
                    table+="</tbody>";
                    table+="</table>";
                    tip_index=layer.tips(table,"#showQuantityDetail-"+type+"-"+order_id+"",{tips:[3, '#fff'],area: ['250px', 'auto'],time:10000});
                    $("#showQuantityDetail-"+type+"-"+order_id+"").mouseleave(function(){
                        layer.close(tip_index);
                    });
                }
            });
        }
        //退货信息显示
        window.show_after_refund = function(order_id,time_send_1=0,after_refund_type_txt='',after_refund_num,after_refund_reason) {
            if(time_send_1<=0){
                return true;
            }
            var txt_all=after_refund_type_txt=='数量退'?'数量退：'+after_refund_num+'件':after_refund_type_txt;
            var table="<table class='layui-table small-table'><tbody><tr class='top'>" +
                "<td><strong>退货类型</strong></td><td>"+txt_all+"</td>" +
                "</tr>" +
                "<tr class='foot'><td><strong>退货原因</strong></td><td>"+after_refund_reason+"</td>" +
                "</tr>" +
                "</tbody></table>";
            tip_index=layer.tips(table,"#show_after_refund_"+order_id+"",{tips:[3, '#fff'],area: ['250px', 'auto'],time:10000});
            $("#show_after_refund_"+order_id+"").mouseleave(function(){
                layer.close(tip_index);
            });
        }
        });

    var factory_all = xmSelect.render({
        el: '#factory_all',
        name:'factory_all',
        autoRow: true,
        filterable: true,
        tree: {
            show: true,
            showFolderIcon: true,
            showLine: true,
            indent: 20,
            expandedKeys: [ -3 ],
        },
        toolbar: {
            show: true,
            list: ['ALL', 'REVERSE', 'CLEAR']
        },
        // height: 'auto',
        data: function(){
            return factoryAll;
        }
    })
</script>
{include file="mp@out_node_progress/menu_ext" /}